<template>
	<view>
		<u-loading-page :loading="is_loading" loading-text="loading..."></u-loading-page>
		<view v-show="!is_loading">
			<view class="bgc_red">
				<view class="top">
					<view class="top1">
						可提现金额(￥)
					</view>
					<view class="top2">
						{{income1}}
					</view>
				</view>
			</view>
			<!-- 余额 -->

			<view class="balance flex1">

				<view class="balance_t ">
					<view class="flex1">

						<view class="balance_t_t">
							提现金额
						</view>
						<view class="daozhang1">

						</view>
					</view>

					<view class="balance_t_b">
						<!-- <input class="inpt" v-model="price1" type="number" placeholder="￥0.00"
							placeholder-style="color:#999999;font-size: 64rpx;" @input="changenum()"> -->
							<input  class="inpt" v-model="price1"  placeholder="￥0.00"
							placeholder-style="color:#999999;font-size: 64rpx;" @input="changenum()" type="digit" />

						<!-- <view class="jiner flex1">
							<view class="daozhang">
								到账金额:{{price2}}
							</view>
							<view class="daozhang">
								平台服务费:{{price3}}
							</view>
						</view> -->

					</view>
				</view>
				<view class="balance_b" @click="jilv()">
					提现记录
				</view>

			</view>
			<view class="serss">
				<view class="serss_">
					<view class="serss_t flex1">
						<image src="/static/index/alipay.png" class="image_2" />
						<!-- 		<view class="line1"></view> -->
						提现到支付宝账户
					</view>

				</view>
				<view class="userinfo">
					<view class="input flex1">
						<view class="input_l">
							账户姓名
						</view>
						<u--input placeholder="请输入账户姓名" v-model="form.name" border="none" clearable></u--input>
					</view>
					<view class="input flex1">
						<view class="input_l">
							提现账号
						</view>
						<u--input placeholder="请输入提现账号" v-model="form.idcode" border="none" clearable></u--input>
					</view>
					<view class="input flex1">
						<view class="input_l">
							确认账号
						</view>
						<u--input placeholder="请确认提现账号" v-model="form.idcode1" border="none" clearable></u--input>
					</view>


				</view>
			</view>

			<view class="flex1" style="height: 178rpx;width: 100%; background-color: #F5F5F5;">
				<view class="btn" @click="tixian()">确认提现</view>
			</view>

		</view>
		<u-popup :show="show2" @close="show2=false" :round="15" mode="center">
			<view class="jm-box">
				<view class="" style="font-size: 38rpx;font-weight: bold; text-align: center;margin-bottom: 20rpx;">
					下单须知
				</view>
				<rich-text :nodes="nodes"></rich-text>
				<view @click="show1=true,show2=false" style="width: 590rpx;margin-top: 20rpx;"
					class="bottomButton flex-row-center">
					知道了
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				show2:false,
				nodes:'',
				is_loading: true,
				zhifubaoid: '',
				income1: 0,
				income2: 0,
				service_fee: 0,
				deposit: 0,
				name: '',
				payList: [{
						name: '支付宝',
						value: 2,
						icon: "/static/index/alipay.png",
						disabled: false
					},

				],
				form: {
					name: '',
					idcode: '',
					idcode1: '',

				},
				height: 120,
				price: 0,
				price1: "",
				price2: 0,
				price3: 0,
				// selectList: [{
				// 	icon: '/static/my/wallet1.png',
				// 	name: '充值',
				// 	url: '/pages/my/recharge'
				// }, {
				// 	icon: '/static/my/wallet2.png',
				// 	name: '提现',
				// 	url: ''
				// }, {
				// 	icon: '/static/my/wallet3.png',
				// 	name: '消费明细',
				// 	url: ''
				// }]
			};
		},
		async onLoad(options) {
			this.init()
			let data = await this.$u.api.article({
				id:'7'
			});
			console.log(data, 'data');
			if (data) {
			console.log(data,'hhaaaaaaaaaaaaaaaaaaaa');
				
				this.nodes = data.data.content
				// this.income1 = 100
				
			}
			this.show2=true
			
		},
		methods: {
			nextPage(_url) {
				uni.navigateTo({
					url: _url
				})
			},
			async tixian() {
				if (this.form.idcode!= this.form.idcode1) {
					uni.$u.toast('两次账号不一致');
					return
				}
				if (!this.price1) {
					uni.$u.toast('必填内容不可为空')
					return
				}
				if (this.price1 > this.income1) {
					uni.$u.toast('不可超过可提现金额');
					return
				} 
				else {
					var that = this
					var form = that.form
					console.log(form);
					// var worldAreaCode = that.worldAreaCode
					for (var i in form) {
						
						if (form[i] == 'undefined' || !form[i] || !/[^\s]/.test(form[i])) {
							uni.$u.toast('必填内容不可为空')
							return
						}

					}
					let data = await this.$u.api.wallet({
						account: this.form.idcode,
						name: this.form.name,
						money: this.price1

					});
					console.log(data, 'data');
					if (data) {
						// this.init()
						uni.$u.toast(data.msg)
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/index/index'
							})
						}, 500)
					}
				}

			},
			changenum() {
				this.price2 = Math.floor(this.price1 * (1 - this.service_fee) * 100) / 100;
				this.price3 = Math.floor(this.price1 * this.service_fee * 100) / 100;
			},
			async init() {
				this.is_loading = true;
				let data = await this.$u.api.index({
					
				});
				console.log(data, 'data');
				if (data) {
				
					
					this.income1 = data.data.money
					// this.income1 = 100
					
				}

				this.is_loading = false
			},
			jilv() {
				uni.navigateTo({
					url: '/pages/index/jilv'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bottomButton {
		// margin-right: 30rpx;
		text-align: center;
		line-height: 80rpx;
		width: 690rpx;
		height: 80rpx;
		background: linear-gradient(90deg, #C74BF1 0%, #8538FC 100%);
		border-radius: 60rpx 60rpx 60rpx 60rpx;
		opacity: 1;
		font-size: 30rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
	.jm-box {
		width: 652rpx;
		min-height: 800rpx;
		background: #FFFFFF;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		padding: 40rpx 30rpx;
		opacity: 1;
	
		.header {
			display: flex;
			align-items: center;
		}
	
		.txt {
			font-family: PingFangSC-Semibold;
			font-size: 30rpx;
			font-weight: normal;
			line-height: 38rpx;
			letter-spacing: 0px;
			color: #333333;
			margin: 30rpx 0;
		}
	
		.active {
			display: flex;
			align-items: center;
			// width: 600rpx;
			//超出一行省略号
	
		}
	
		.mydizhi {
			width: 600rpx;
			font-size: 28rpx;
			margin-left: 10rpx;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}
	}
	
	.bgc_red {
		width: 100%;
		height: 280rpx;
		border-radius: 0 0 30rpx 30rpx;
		background-image: url("../../static/index/bg4.png");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}

	.top {
		padding: 30rpx;
	}

	.userinfo {
		padding: 20rpx 30rpx;
		padding-top: 0;
		// margin: 30rpx auto;
		background-color: white;
		padding-bottom: 2rpx;
	}

	.input {
		padding: 30rpx 20rpx;
		border-bottom: 1rpx solid #DDDDDD;
	}


	.input_l {
		width: 30%;
		font-size: 30rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		// font-weight: bold;
		color: #333333;
		line-height: 45rpx;
	}

	.input_r {
		border-bottom: 2rpx solid #E8E8E8;
	}

	.serss_ {
		margin: 20rpx 40rpx;

		margin-bottom: 0;
	}

	.top1 {
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 50rpx;
	}

	.top2 {
		font-size: 40rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 50rpx;
	}

	.balance {
		width: 90%;
		// height: 290rpx;
		justify-content: space-between;
		margin: 0 auto;
		margin-top: -120rpx;
		background-color: #fff;
		border-radius: 20rpx;
		// padding: 0 24rpx;

	}

	.balance_t {
		width: 70%;
		// height: 290
		padding: 20rpx;
	}

	.balance_t_t {

		font-size: 30rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 28rpx;

	}

	.balance_t_b {
		font-size: 50rpx;
		font-weight: bold;
		color: #55A3B9;
		line-height: 75rpx;
	}

	.balance_b {
		// width: 124rpx;
		height: 52rpx;
		padding: 10rpx 20rpx;
		padding-right: 10rpx;
		background: linear-gradient(180deg, #C74BF0 0%, #8438FC 100%);
		border-radius: 60rpx 0rpx 0rpx 60rpx;

		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 52rpx;

	}

	.inpt {
		color: #333;
		height: 100rpx;
		padding: 20rpx 10rpx;
		font-size: 64rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
		line-height: 50rpx;
	}



	.inpt1 {
		width: 70%;
		margin-top: 5rpx;
		// margin-left: 20rpx;
		color: #333;
		font-size: 42rpx;

	}

	.serss {
		width: 90%;
		// height: 290rpx;
		margin: 0 auto;
		background-color: white;
		padding-bottom: 2rpx;
	}

	.btn {
		width: 93%;
		height: 90rpx;
		border-radius: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		background: linear-gradient(90deg, #C74BF0 0%, #8438FC 100%);
		color: white;
		margin-top: 200rpx;
	}

	.select_btn {
		width: 42rpx;
		height: 42rpx;
	}

	.line1 {
		width: 8rpx;
		height: 32rpx;
		background: #55A3B9;
		border-radius: 8rpx;
		margin-right: 16rpx;
	}

	.serss_t {
		margin-right: 20rpx;
		font-size: 32rpx;
		font-weight: bold;
		color: #333333;
		padding: 18rpx 0;
	}

	.image_2 {
		width: 48rpx;
		height: 48rpx;
		margin-right: 10rpx;
	}

	.tips_l {
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #F90000;
		line-height: 39rpx;
	}

	.tips {
		margin-top: 50rpx;
		padding: 30rpx;
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 39rpx;
	}

	.daozhang {
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #55A3B9;
		line-height: 28rpx;
	}

	.daozhang1 {
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		// color: #55A3B9;
		line-height: 28rpx;
	}


	.jiner {
		justify-content: space-between;
	}
</style>